<template>
    <view>
        <block v-if="isAdmin">
            <view class="main-admin">
                <!-- parse <include src="../add/admin_meet_form_tpl.wxml"/> -->
                <block>
                    <view class="form-box shadow">
                        <view class="form-group">
                            <view class="title must">老师名称</view>
                            <input placeholder="请输入老师的名称" placeholder-class="phc" v-model="formTitle" :focus="formTitleFocus" maxlength="50" />
                        </view>
                        <view v-if="formTitleFocus" class="hint-desc error">{{ formTitleFocus }}</view>

                        <view v-if="cateIdOptions.length > 1 && isAdmin" class="form-group arrow" id="formCateId">
                            <view class="title must">分类</view>
                            <cmpt-picker
                                id="cate-picker"
                                :sourceData="cateIdOptions"
                                @select="url($event, { type: 'picker', item: 'formCateId', tagId: 'cate-picker' })"
                                data-type="picker"
                                data-item="formCateId"
                                :item="formCateId"
                            ></cmpt-picker>
                        </view>
                        <view v-if="formCateIdFocus" class="hint-desc error">{{ formCateIdFocus }}</view>

                        <view class="form-group" v-if="isAdmin">
                            <view class="title must">
                                排序号
                                <text class="text-grey text-normal margin-left-xs">(小的先显示)</text>
                            </view>
                            <input placeholder="排序号，小的先显示" type="number" placeholder-class="phc" v-model="formOrder" :focus="formOrderFocus" maxlength="4" />
                        </view>
                        <view v-if="formOrderFocus" class="hint-desc error">{{ formOrderFocus }}</view>

                        <view class="form-group" id="formCancelSet">
                            <view class="title must">取消设置</view>
                            <cmpt-picker mark="cancelSet" style="flex: 1" :item.sync="formCancelSet" sourceDataStr="0=不可取消,1=随时可取消,2=仅开始前可取消" />
                        </view>
                        <view v-if="formCancelSetFocus" class="hint-desc error">{{ formCancelSetFocus }}</view>
                    </view>

                    <view id="formDaysSet" class="form-box shadow" style="background-color: #fef2ce">
                        <view @tap="url" :data-url="'../time/' + (isAdmin ? 'admin' : 'work') + '_meet_time'" class="form-group arrow">
                            <view class="title must">预约时段排期设置</view>
                            <view v-if="formDaysSet.length" class="form-text text-red text-bold">{{ formDaysSet.length }}天可约</view>
                            <view v-else class="form-text text-orange">请配置可预约时段</view>
                        </view>
                        <view v-if="formDaysSetFocus" class="hint-desc error">{{ formDaysSetFocus }}</view>
                    </view>

                    <view id="formPhone" class="form-box shadow">
                        <view class="form-group">
                            <view class="title must">老师登录手机</view>
                            <input maxlength="11" type="number" placeholder="请填写登录手机号码" v-model="formPhone" :focus="formPhoneFocus" />
                        </view>
                        <view v-if="formPhoneFocus" class="hint-desc error">{{ formPhoneFocus }}</view>

                        <view class="form-group text-orange" v-if="isAdmin && isEdit">
                            <text class="icon-info" style="font-size: 24rpx">不修改密码则保持以下为空</text>
                        </view>
                        <view class="form-group">
                            <view class="title must">老师登录密码</view>
                            <input maxlength="30" placeholder="请填写登录密码" v-model="formPassword" :focus="formPasswordFocus" />
                        </view>
                        <view v-if="formPasswordFocus" class="hint-desc error">{{ formPasswordFocus }}</view>
                    </view>

                    <view class="form-box shadow margin-top-xs">
                        <cmpt-form-show
                         v-if="isFormReady"
                            id="cmpt-form"
                            mark="cmpt-form"
                            source="admin"
                            :isCacheMatch="false"
                            :fields="fields"
                            :forms="formForms"
                            :isDefMatch="id ? false : true"
                        ></cmpt-form-show>
                    </view>

                    <!-- <view class="form-box shadow">
                        <view @tap="goToContentEdit" class="form-group arrow" id="formContent">
                            <view class="title must">详细内容</view>
                            <view :class="'form-text ' + (contentDesc == '未填写' ? 'text-orange' : '')">{{ contentDesc }}</view>
                        </view>
                        <view v-if="formContentFocus" class="hint-desc error">{{ formContentFocus }}</view>
                    </view> -->

                    <view class="form-box shadow" v-if="isAdmin">
                        <view class="form-group">
                            <view class="title must">
                                预约用户填写数据项目
                                <text class="text-grey text-normal">(共{{ formJoinForms.length }}个字段)</text>
                            </view>
                        </view>
                        <cmpt-form-set id="form-set" @formset="bindJoinFormsCmpt($event, { tagId: 'form-set' })" :fields="formJoinForms" />
                    </view>
                </block>

                <button @tap="bindFormAddSubmit" class="btn-admin margin-top-l">创建</button>
            </view>
        </block>
    </view>
</template>

<script>
import cmptFormSet from '@/cmpts/public/form/form_set/form_set_cmpt';
import cmptFormSetField from '@/cmpts/public/form/form_set/field/form_set_field';
import cmptFormShow from '@/cmpts/public/form/form_show/form_show_cmpt';
import cmptPickerTime from '@/cmpts/public/picker_time/picker_time_cmpt';
import cmptPickerMulti from '@/cmpts/public/picker_multi/picker_multi_cmpt';
import AdminBiz from '@/utils/comm/biz/admin_biz.js';
import pageHelper from '@/utils/helper/page_helper.js';
import PublicBiz from '@/utils/comm/biz/public_biz.js';
import cloudHelper from '@/utils/helper/cloud_helper.js';
import validate from '@/utils/helper/validate.js';
import AdminMeetBiz from '@/utils/biz/admin_meet_biz.js';
import projectSetting from '@/utils/public/project_setting.js';

const api = require('@/api/adminapi.js');
export default {
    components: {
        cmptFormSet,
        cmptFormSetField,
        cmptFormShow,
        cmptPickerTime,
        cmptPickerMulti
    },
    data() {
        return {
            isLoad: true,
            formJoinForms: [],
            isAdmin: false,
            formTitle: '',
            formTitleFocus: null,
            cateIdOptions: [],
            formCateId: '',
            formCateIdFocus: null,
            formOrder: '',
            formOrderFocus: null,
            formCancelSet: '',
            formCancelSetFocus: null,
            formDaysSet: [],
            formDaysSetFocus: null,
            formPhone: '15151846978',
            formPhoneFocus: null,
            isEdit: '',
            formPassword: '',
            formPasswordFocus: null,
            fields: [],
            formForms: [],
            id: false,

            // 内容相关字段
            formContent: [
                {
                    type: 'text',
                    val: ''
                }
            ],
            contentDesc: '未填写',
            formContentFocus: null
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: async function (options) {
        if (!AdminBiz.isAdmin(this)) {
            return;
        }
        uni.setNavigationBarTitle({
            title: projectSetting.MEET_NAME + '-添加'
        });
        // await this.setData(await AdminMeetBiz.initFormData()); // 初始化表单数据
        const init = await AdminMeetBiz.initFormData();
          // onLoad
        this.setData(init);
        this.$nextTick(() => { this.isFormReady = true; });
		this.isFormReady = true;
        // console.log('this.cateIdOptions', this.cateIdOptions);
        console.log('this.fields', this.fields);
        console.log('this.formForms', this.formForms);
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {
        // 监听内容更新事件
        uni.$on('admin_content_updated', this.onContentUpdated);
        
        // 检查是否有缓存的内容数据
        let cachedContent = uni.getStorageSync('admin_content_edit_data');
        if (cachedContent && cachedContent.length > 0) {
            this.setData({
                formContent: cachedContent
            });
        }
        
        this.setContentDescFun();
    },
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {
        // 移除事件监听
        uni.$off('admin_content_updated', this.onContentUpdated);
        
        // 清理缓存数据
        uni.removeStorageSync('admin_content_edit_data');
    },
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: async function () {
        uni.stopPullDownRefresh();
    },
    methods: {
        // 内容描述相关方法
        _setContentDesc: function () {
            this.setContentDescFun();
        },
        
        setContentDescFun: function () {
            AdminBiz.setContentDesc(this);
        },

        // 内容编辑相关方法
        goToContentEdit: function () {
            // 跳转前保存当前内容到缓存
            uni.setStorageSync('admin_content_edit_data', this.formContent);
            uni.navigateTo({
                url: '/pages/admin/content/admin_content'
            });
        },

        onContentUpdated: function (formContent) {
            // 更新本页面的内容数据
            this.setData({
                formContent: formContent
            });
            this.setContentDescFun();
        },

        bindJoinFormsCmpt: function (e, _dataset) {
            /* ---处理dataset begin--- */
            this.handleDataset(e, _dataset);
            /* ---处理dataset end--- */
            this.setData({
                formJoinForms: e.detail
            });
        },

        bindFormAddSubmit: async function () {
            pageHelper.formClearFocus(this);
            if (!AdminBiz.isAdmin(this)) {
                return;
            }
            let data = this;
            if (data.formDaysSet.length <= 0) {
                pageHelper.anchor('formDaysSet', this);
                return pageHelper.formHint(this, 'formDaysSet', '请配置「可预约时段」');
            }
            if (data.formJoinForms.length <= 0) {
                return pageHelper.showModal('请至少设置一项「用户填写资料」');
            }
            data = validate.check(data, AdminMeetBiz.CHECK_FORM, this);
            if (!data) {
                return;
            }
            if (data.password.length == 0) {
                pageHelper.anchor('formPassword', this);
                return pageHelper.formHint(this, 'formPassword', '请设置登录密码');
            }
            let forms = this.zpSelectComponent('#cmpt-form').getForms(true);
            if (!forms) {
                return;
            }
            data.forms = forms;
            data.cateName = AdminMeetBiz.getCateName(data.cateId);
            data.fr
            try {
                // 先创建，再上传
                let result = await api.addTeacher(data);
                // let meetId = result.data.id;
                // 图片
                // await cloudHelper.transFormsTempPics(forms, 'meet/', meetId, 'admin/meet_update_forms');
                let callback = async function () {
                    PublicBiz.removeCacheList('admin-meet');
                    PublicBiz.removeCacheList('meet-list');
                    uni.navigateBack();
                };
                pageHelper.showSuccToast('添加成功', 2000, callback);
            } catch (err) {
                console.log('CatchClause', err);
                console.log('CatchClause', err);
                console.log(err);
            }
        },

        url: function (e, _dataset) {
            /* ---处理dataset begin--- */
            this.handleDataset(e, _dataset);
            /* ---处理dataset end--- */
            pageHelper.url(e, this);
        }
    }
};
</script>
<style>
@import './admin_meet_add.css';
</style>
